<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="common/head.jsp" %>
<script type="text/javascript">
  $(function(){
	  var search=function(pageCode){
	  var param=$("#category").val();
	  $.ajax({
			url:"ProductmServlet",
			type:"post",
			 dataType:"json",
			 data:{
				 currpage:pageCode,
				 op:"findproBycategory",
				 category:param
			 },
			 success : function(data){
					$("#pro").html('');
					$.each(data.beanList,function(idx,pro){
						$("#pro").append("<li><dl><dt><a href='${ctx}/ProductmServlet?op=prefindProById&pid="+pro.pid+"'  target='_self'><img src='images/product/1.jpg' /></a></dt><dd class='title'><a href='${ctx}/ProductmServlet?op=prefindProById&pid="+pro.pid+"' target='_self'>"+pro.pname+"</a></dd><dd class='price'>￥"+pro.price+"</dd></dl></li>");
						
						
					});
					  laypage({
							cont : 'fenye',  //容器id：存放分页
							pages : data.totalPage, //得到总页数
							curr:  data.pageCode || 1,  //当前页
							skip: true, //是否开启跳页
							skin: '#AF0000',  //页码的颜色
							groups: 5,  //
							jump : function(obj, first) {
								if (!first) {   //首次加载不执行，并传递当前页：obj.curr
									search(obj.curr);  //调用函数
								}
							}
						}); 		
			 }
		})		
	  }
	  search(1);
  });
</script>
<div id="position" class="wrap">
	您现在的位置：<a href="index.jsp">易买网</a> &gt; <a href="product-list.jsp">图书音像</a> &gt; 图书
</div>
<div id="main" class="wrap">
	<div class="lefter">
		<div class="box">
			<h2>商品分类</h2>
			<dl>
			<dt>图书音像</dt>
				<dd><a href="${ctx}/product-list.jsp?category=图书">图书</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=音乐">音乐</a></dd>
				<dt>百货</dt>
				<dd><a href="${ctx}/product-list.jsp?category=运动健康">运动健康</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=服装">服装</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=家居">家居</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=美妆">美妆</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=母婴">母婴</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=食品">食品</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=手机数码">手机数码</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=家具首饰">家具首饰</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=手表饰品">手表饰品</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=鞋包">鞋包</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=家电">家电</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=电脑办公">电脑办公</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=玩具文具">玩具文具</a></dd>
				<dd><a href="${ctx}/product-list.jsp?category=汽车用品">汽车用品</a></dd>
			</dl>
		</div>
		<div class="spacer"></div>
		<div class="last-view">
			<h2>最近浏览</h2>
			<dl class="clearfix">
				<dt><img src="images/product/10_small.jpg" /></dt>
				<dd><a href="product-view.jsp"  target="_self">利仁2018M福满堂电饼铛 好用实惠</a><a href="product-view.jsp"></a></dd>
				<dt>&nbsp;</dt>
				<dd>&nbsp;</dd>
		  </dl>
			<script type="text/javascript">
				document.write("Cookie中记录的购物车商品ID："+ getCookie("product") + "，可以在动态页面中进行读取");
			</script>
		</div>
	</div>
	<div class="main">
		<div class="product-list">
			<h2>全部商品</h2>
			<input type="hidden" name="category" value="${param.category}" id="category"/>			
			<div class="clear"></div>
			<ul class="product clearfix" id="pro">
				<li>
					<dl>
						<dt><a href="product-view.jsp" target="_self"><img src="images/product/1.jpg" /></a></dt>
						<dd class="title"><a href="product-view.jsp" target="_self">法国德菲丝松露精品巧克力500g/盒</a></dd>
						<dd class="price">￥108.0</dd>
					</dl>
				</li>
				
			</ul>
			<div class="clear"></div>
			<div id="fenye"></div>
		</div>
	</div>
	<div class="clear"></div>
</div>
<%@ include file="common/foot.jsp" %>
